<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>墨阅-后台系统</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link th:href="@{/moyue/css/bootstrap.min.css}" rel="stylesheet"/>
	<link th:href="@{/moyue/css/face.css}"  rel="stylesheet">
	<link th:href="@{/moyue/font-awesome-4.7.0/css/font-awesome.min.css}" rel="stylesheet">
	<link rel="shortcut icon" th:href="@{moyue/images/favicon.ico}" type="image/x-icon"/>
</head>
<body id="allBody">
<div class="top">
	墨阅--后台管理
	<i class="fa fa-navicon" style="color:#f7f7f7;font-size:10px;padding-left: 50px"></i>
</div>
<div class="fixed">
	<div class="broad">
		<ul>
			<li class="broad-item">
				<a href="/moyue/admin/bms/?page=1"><span>用户管理</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
			<li class="broad-item">
				<a href="/moyue/admin/book/all/?page=1" ><span>书籍管理</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
			<li class="broad-item">
				<a href="shenhe.html"><span>审核书籍</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
			<li class="broad-item">
				<a th:href="@{/moyue/admin/parentype} "><span>管理书籍类型</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
			<li class="broad-item">
				<a th:href="@{/moyue/admin/}"><span>管理书籍标签</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
			<li class="broad-item">
				<a href="/moyue/word/all/?page=1"><span>敏感词管理</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
			<li class="broad-item">
				<a th:href="@{/moyue/admin/book/uploadUI}"><span>书籍上传</span><i class="fa fa-angle-left" style="position:absolute;right: 10px;top: 15px; "></i></a>
			</li>
		</ul>
	</div>
	<div class="fixed-iframe">
		<div class="top-face">
			<div class="header">管理书籍类型</div>
			<div class="table-face">
				<div class="table-mg">
					<div class="mg-add" style="margin-left: 0px">
						<button type="button" class="mg-add-button" onclick="addp()">+&nbsp;新增</button>
					</div>
				</div>
                <div class="table-bet">
                    <table class="table table-striped">
                        <thead>
                        <tr>
                            <th class="td1"></th>
                            <th>书籍类型</th>
                            <th colspan="3">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="parentype : ${parenttypes}">
                            <input type="hidden" th:value="${parentype.typeId}" >
                            <td class="td1"><input type="checkbox" th:value="${parentype.typeId}"  name="user-count"></td>
                            <td class="parentname" th:text="${parentype.typeName}"></td>
                            <td>
                                <a href="#" class="bet-check">查看子类型</a>
                            </td>
                            <td>
                                <a href="#" class="bet-edit">编辑</a>
                            </td>
                            <td>
                                <a href="#" class="bet-delete">删除</a>
                            </td>
                        </tr>

                        </tbody>
                    </table>
                </div>
			</div>
            <div class="bgback none"></div>
            <div class="sontype none">
				<i class="iconfont sontype-x" onclick="addnone($('.sontype'),$('.bgback'))">&#xe62c;</i>
                <div class="sontype-s">

                </div>
                <div class="sontype-t" onclick="addsontype()">添加子类型</div>
                <div class="sontype-b">确认</div>
            </div>
            <div class="addsont none">
				<i class="iconfont sontype-x" onclick="addnone($('.addsont'),$('.addsonback'))">&#xe62c;</i>
                 <input placeholder="请输入子类型名称" class="addson">
				<div class="addsont-b">确认添加</div>
				<input class="tianparentid" type="hidden">
            </div>
			<div class="addsonback none"></div>
            <div class="preedit none">
				<i class="iconfont sontype-x" onclick="addnone($('.preedit'),$('.bgback'))">&#xe62c;</i>
                <input class="preeditname" >
				<input class="preeditid" type="hidden">
                <div class="preedit-b">修改</div>
            </div>
			<div class="addp none">
				<i class="iconfont sontype-x" onclick="cloaddp()">&#xe62c;</i>
				<input class="addpname" >
				<div class="addp-b">增加</div>
			</div>
		</div>
	</div>
</div>

<script  th:src="@{/moyue/js/jquery-3.3.1.min.js}"></script>
<script  th:src="@{/moyue/js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/moyue/js/face.js}"></script>
<script th:inline="javascript">
	//新增父
    $('.addp-b').on('click',function () {
        $.ajax({
            type: "PUT",//数据发送的方式（post 或者 get）
            url: "/moyue/admin/parentype",//要发送的后台地址
            data: {
                typeName: $('.addpname').val(),
            },//要发送的数据（参数）格式为{'val1':"1","val2":"2"}

            dataType:"JSON",
            success: function (data) {//ajax请求成功后触发的方法
                if(data.code==0){
                    alert(data.msg);
                    location.reload();
                }else{
                    alert(data.msg);
                }
            },
            error: function (msg) {//ajax请求失败后触发的方法
                alert("网络故障");//弹出错误信息
            }
        });
    })
	//查看子类型
    $('.bet-check').on('click',function () {
        var parent = $(this).parent().parent();
        $('.bgback').addClass('block').removeClass('none');
        $('.sontype').removeClass('none').addClass('block');
        var parid=parent.children('input').val();
        $('.tianparentid').val(parid);
        $.ajax({
            type: "GET",//数据发送的方式（post 或者 get）
            url: "/moyue/admin/sontype",//要发送的后台地址
            data: {
                parentTypeId:parid ,
            },//要发送的数据（参数）格式为{'val1':"1","val2":"2"}
            dataType:"JSON",
            success: function (data) {//ajax请求成功后触发的方法
                if(data.code==0){
                    var datas=data.data;
                    $(".sontype-s").empty();
                    for (var aa in datas){
                        var str = "<input  sonid="+datas[aa].typeId +"  "+ "value=" + datas[aa].typeName + " ></input>";
                        $(".sontype-s").append(str);
                    }
                }else{
                    alert(data.msg);
                }
            },
            error: function (msg) {//ajax请求失败后触发的方法
                alert("网络故障");//弹出错误信息
            }
        });
    })
	//发送子类型集合
	$('.sontype-b').on('click',function () {
		var aa=[];
		var bb=[];
		var sons=$('.sontype-s').children('input');
		for (let i=0;i<sons.length;i++){
		    // console.log( sons[i].attributes[0].value);
		    aa.push(sons[i].attributes[0].value);
            bb.push( $(sons[i]).val());
		}

        $.ajax({
            type: "GET",//数据发送的方式（post 或者 get）
            url: "/moyue/admin/updatesons",//要发送的后台地址
            traditional: true,
            data: {
                sonId:aa,
                sonName:bb,
            },//要发送的数据（参数）格式为{'val1':"1","val2":"2"}

            dataType:"JSON",
            success: function (data) {//ajax请求成功后触发的方法
                if(data.code==0){
                    $('.bgback').addClass('none').removeClass('block');
                    $('.sontype').removeClass('block').addClass('none');
                }else{
                    alert(data.msg);
                }
            },
            error: function (msg) {//ajax请求失败后触发的方法
                alert("网络故障");//弹出错误信息
            }
        });
    })
	//编辑父类型
    $('.bet-edit').on('click',function () {
        $('.preedit').removeClass('none').addClass('block');
        $('.bgback').addClass('block').removeClass('none');
        var parent = $(this).parent().parent();
        $('.preeditname').val(parent.children('td.parentname').text());
        $('.preeditid').val(parent.children('input').val());
    })
	//发送编辑的父类型
	$('.preedit-b').on('click',function () {
        $.ajax({
            type: "GET",//数据发送的方式（post 或者 get）
            url: "/moyue/admin/cheangtypeName",//要发送的后台地址
            data: {
                typeId:$('.preeditid').val() ,
                typeName: $('.preeditname').val(),
            },//要发送的数据（参数）格式为{'val1':"1","val2":"2"}

            dataType:"JSON",
            success: function (data) {//ajax请求成功后触发的方法
                if(data.code==0){
                    alert(data.msg);
                    location.reload();
                }else{
                    alert(data.msg);
                }
            },
            error: function (msg) {//ajax请求失败后触发的方法
                alert("网络故障");//弹出错误信息
            }
        });
    })
	//添加子类型
	$('.addsont-b').on('click',function () {
        $.ajax({
            type: "GET",//数据发送的方式（post 或者 get）
            url: "/moyue/admin/addsontype",//要发送的后台地址
            data: {
                typeName:$('.addson').val() ,
                parentTypeId: $('.tianparentid').val(),
            },//要发送的数据（参数）格式为{'val1':"1","val2":"2"}

            dataType:"JSON",
            success: function (data) {//ajax请求成功后触发的方法
                if(data.code==0){
                    alert(data.msg);
                    location.reload();
                }else{
                    alert(data.msg);
                }
            },
            error: function (msg) {//ajax请求失败后触发的方法
                alert("网络故障");//弹出错误信息
            }
        });
	})
	$('.bet-delete').on('click',function () {
        var parent = $(this).parent().parent();
        var parentids = parent.children("td.td1").children("input").val();
        $.ajax({
            type: "Delete",//数据发送的方式（post 或者 get）
            url: "/moyue/admin/parentype/"+ parentids,//要发送的后台地址
            data: {
                parentypeId:parentids,
            },//要发送的数据（参数）格式为{'val1':"1","val2":"2"}

            dataType:"JSON",
            success: function (data) {//ajax请求成功后触发的方法
                if(data.code==0){
                    alert(data.msg);
                    location.reload();
                }else{
                    alert(data.msg);
                }
            },
            error: function (msg) {//ajax请求失败后触发的方法
                alert("网络故障");//弹出错误信息
            }
        });
    })
</script>
</body>
</html>
